﻿@{
    List<KRM.Core.WebStats> list = ViewBag.WebStats;
    List<KRM.Core.spGetListOrderByStore_Result> listOrders = ViewBag.ListOrders;
    int count = 0;
}
<script>
    $(document).ready(function() {
        var height = $(window).height() - 300;
        $(".table-stats").attr("data-height", height);
        //var tab = $("#storeid").val();
        //InitAjaxTable($(".table-tab-" + tab));
    });
    function showBox(obj) {
        var idBox = $(obj).attr("value");
        if ($("#" + idBox).css('display') == 'table-row') {
            $("#expand-" + idBox).html("<img src='/img/expand.png'  style='width: 20px;'/>");
        }
        else{
            $("#expand-" + idBox).html("<img src='/img/colpand.png'  style='width: 20px;'/>");
        }
        $("#" + idBox).slideToggle();
    }
</script>
<div class="container-fluid">
    <div class="row-fluid">
        <table class="table table-bordered table-fix table-tab-@ViewBag.StoreId table-stats">
            <thead>
                <tr>
                    <th style="width: 20px;">​</th>
                    <th>​</th>
                    <th>YESTERDAY<br />@ViewBag.Yesterday</th>
                    <th>LAST WEEK<br />@ViewBag.LastWeek</th>
                    <th>Difference</th>
                    <th>% Difference</th>
                    <th>LAST YEAR<br />@ViewBag.LastYear</th>
                    <th>Difference</th>
                    <th>% Difference</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in list)
                {
                    <tr >
                        <td  @(item.IsBreakdown?"value=box-"+count+"-"+ ViewBag.StoreId+" onclick=showBox(this)":"")>
                            @if (item.IsBreakdown)
                            {
                                <div id="expand-box-@count-@ViewBag.StoreId" style="cursor: pointer;">
                                    <img src="/img/expand.png" style="width: 20px;"/>
                                </div>
                            }
                        </td>
                        <td><b>@item.Name</b></td>
                        <td>@item.Yesterday<span>@(item.IsPercent ? "%" : "")</span><span>@(item.IsPound ? "£" : "")</span></td>
                        <td>@item.Lastweek<span>@(item.IsPercent ? "%" : "")</span><span>@(item.IsPound ? "£" : "")</span></td>
                        <td class="@(item.DifferenceW > 0 ? "valueup" : "valuedown")">@item.DifferenceW<span>@(item.IsPercent ? "%" : "")</span><span>@(item.IsPound ? "£" : "")</span></td>
                        <td class="@(item.DifferencePW > 0 ? "valueup" : "valuedown")">@item.DifferencePW<span>%</span></td>
                        <td>@item.Lastyear<span>@(item.IsPercent ? "%" : "")</span><span>@(item.IsPound ? "£" : "")</span></td>
                        <td class="@(item.DifferenceY > 0 ? "valueup" : "valuedown")">@item.DifferenceY<span>@(item.IsPercent ? "%" : "")</span><span>@(item.IsPound ? "£" : "")</span></td>
                        <td class="@(item.DifferencePY > 0 ? "valueup" : "valuedown")">@item.DifferencePY<span>%</span></td>
                    </tr>
                    if (item.Name.ToLower() == "num sold (phone + web)")
                    {
                        <tr id="box-@count-@ViewBag.StoreId" style="display: none;">
                            <td colspan="9">
                                <div class="row-fluid">
                                    <div class="fieldset" style="max-height: 200px;overflow: auto;">
                                        <div class="row-fluid" style="margin-bottom: 5px;">
                                            <b>Orders of @ViewBag.Yesterday</b>
                                        </div>
                                        <div class="row-fluid">
                                            <table class="table table-bordered table-fix" style="margin-bottom: 0px;" data-height="200">
                                                <thead>
                                                    <tr>
                                                        <th>OrderID​</th>
                                                        <th>OrderRef</th>
                                                        <th>ProductName</th>
                                                        <th>Qty</th>
                                                        <th>OrderValue</th>
                                                        <th>Status</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @foreach (var item2 in listOrders)
                                                    {
                                                        <tr>
                                                            <td>@item2.OrderID</td>
                                                            <td>@item2.OrderRef</td>
                                                            <td>@item2.Product</td>
                                                            <td>@item2.ItemQty</td>
                                                            <td>@item2.OrderValue</td>
                                                            <td>@item2.Status</td>
                                                        </tr>
                                                    }
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    }
                    count++;
                }
            </tbody>
        </table>
    </div>
</div>
